<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>翻译页面</title>
    <link rel="stylesheet" href="../css/translate.css">
    <link rel="stylesheet" type="text/css" href="../css/foot_style.css"/>
    <link rel="stylesheet" type="text/css" href="../css/head_style.css"/>
    <link rel="stylesheet" type="text/css" href="../css/left_style.css"/>
    <link rel="stylesheet" href="../js/layui-v2.2.6/layui/css/layui.css">
    <link rel="stylesheet" href="../css/fontCss.css">
    <script src="../js/layui-v2.2.6/layui/layui.js"></script>
    <script src="../js/t2.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
    <!--头部-->
    <div class="head">
        <div class="head1 ">
            <img class="img" src="../img/top1.png" alt="汇网" width="50" height="50"/>
            <div class="head-search layui-form">
                <i class="layui-icon layui-icon-face-smile search-icon">&#xe615;</i>
                <div class="layui-input-inline head-search-input">
                    <select name="modules" lay-verify="required" lay-search="">
                        <option value="">寻找人才</option>
                        <option value="1">人才1号</option>
                    </select>
                </div>
            </div>
            <div class="layui-btn layui-btn-sm fabu-btn">发&nbsp;&nbsp;布</div>
            <div class="btns">
                        <span class="language-btns" >
                            中文
                            <i class="layui-icon layui-icon-face-smile language-icon">&#xe61a;</i>
                        &nbsp;&nbsp;&nbsp;
                            <div class="span-div">
                                <p class="cn">中文</p>
								<hr/>
								<p class="eng">English</p>
                            </div>
                        </span>
                <span>&nbsp;&nbsp;&nbsp;</span>
                <div class="img-userhead">
                    <img src="../img/1/10.png" width="32" height="32" style="border-radius: 16px;;"><!--头像-->
                    <span class="user-btn">Manty
                                <i class="layui-icon layui-icon-face-smile user-icon" style="font-size: 14px;">&#xe61a;</i>
                            </span>
                    <div class="userbox">
                        <div class="userbox-user">
                            <img src="../img/1/10.png"/>
                            <span class="userbox-usename">Manty</span>
                            <span class="userbox-usertype">个人用户</span>
                        </div>
                        <div class="userbox-set">
                            <i class="iconfont " style="font-size: 14px;color: #333333;">&#xe606;</i>
                            &nbsp;&nbsp;&nbsp;设置
                        </div>
                        <div class="userbox-out">
                            <i class="iconfont " style="font-size: 14px;color: #333333;">&#xe652;</i>
                            &nbsp;&nbsp;&nbsp;安全退出
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
<div class="nav">
			<div class="nav1">
				<ul>
					<li>首&nbsp;&nbsp;&nbsp;&nbsp;页</li>
					<li>供需大厅</li>
					<li>产品说明</li>
					<li>关于我们</li>
					<li>帮助中心</li>
				</ul>
			</div>
		</div>
    <!-- 主体内容 -->
    <div class="container">
        <div class="left">
            <div class="left-nav">
                <div class="left-userhead">
                    <img src="../img/1/10.png"/>
                </div>
                <div class="left-username">
                    Manty
                </div>
                <!--发布需求-->
                <div class="left-demand left-btn-style" style="margin-top:20px ;">
                    <i class="iconfont">&#xe75e;</i>
                    <span class="">发布需求</span>
                </div>
                <!--发布历史-->
                <div class="left-history left-btn-style">
                    <i class="iconfont">&#xe75f;</i>
                    <span class="">发布历史</span>
                </div>
                <!--交易记录-->
                <div class="left-record left-btn-style">
                    <i class="iconfont">&#xe762;</i>
                    <span class="">交易记录</span>
                </div>
                <!--我的资料-->
                <div class="left-data left-btn-style">
                    <i class="iconfont">&#xe760;</i>
                    <span class="">我的资料</span>
                </div>
                <!--修改密码-->
                <div class="left-password left-btn-style">
                    <i class="iconfont">&#xe762;</i>
                    <span class="">修改密码</span>
                </div>
                <!--签到-->
                <div class="left-sign">
                    <span class="left-sign-span">已连续签到2天</span>
                    <div class="left-sign-btn">签到</div>
                </div>
            </div>
        </div>
        <div class="main">
            <div>
                <div class="information">
                    <div class="photo">
                        <a href=""><img src="../img/zdd.jpg" alt="张大大的头像"></a>
                    </div>
                    <div class="info">
                        <p class="name">张大大</p>
                        <p class="nat"><i class="iconfont">&#xe611;</i><span>中国 北京</span><img src="../img/gj.png" alt="国籍"></p>
                        <p class="text"><span class="disc"></span><span>个人需求</span>我要找国际人才或资源</p>
                    </div>
                    <div class="nationality">
                        <p>国籍</p>
                        <p><img src="../img/gj.png" alt="国籍"></p>
                    </div>
                </div>
            </div>
            <div class="content">
                <div><h2>我提供服务产品设计服务，这个是服务标题，最多显示30个字</h2></div>
                <div class="content-main">
                    <p>App是英文Application的简称，由于iPhone智能手机的流行，现在的APP多指智能手机的第三方应用程序。</p>
                    <p>因为一个项目需要,从Android暂时转了web。对于新生的我选择了layui框架,做了这个开发,,废话少提,进入正题,, layui的字体图标,在layui中使用非常常见,...</p>
                    <p>因为一个项目需要,从And因为一个项目需要,从Androi因为一个项目需要,从Android暂时转了web。对于新生的因为一个项目需要,从Android暂时转了web。对于新生的我选择了layui框架,做了这个开发,,废话少提,进入正题,, layui的字体图标,在layui中使用非常常见我选择了layui框架,做了这个开发,,废话少提,进入正题,, layui的字体图标,在layui中使用非常常见d暂时转了web。对于新生的我选择了layui框架,做了这个开发,,废话少提,进入正题,, layui的字体图标,在layui中使用非常常见roid暂时转了web。对于新生的我选择了layui框架,做了这个开发,,废话少提,进入正题,, layui的字体图标,在layui中使用非常常见,...</p>
                </div>
                <div class="time">
                    <p>发布时间: 2018-03-03</p>
                </div>
            </div>
            <div class="level">
                <p>发布者水平</p>
                <div>
                    <dl>
                        <dt>日语</dt>
                        <dd>不会</dd>
                    </dl>
                    <dl>
                        <dt>韩语</dt>
                        <dd>不会</dd>
                    </dl>
                    <dl>
                        <dt>中文</dt>
                        <dd>精通</dd>
                    </dl>
                    <dl>
                        <dt>英文</dt>
                        <dd>一般</dd>
                    </dl>
                    <dl>
                        <dt>意大利语</dt>
                        <dd>不会</dd>
                    </dl>
                    <dl>
                        <dt>法语</dt>
                        <dd>不会</dd>
                    </dl>
                </div>
            </div>
            <div class="other">
                <div style="margin-bottom: 30px;">
                    <a href="###">钢 管</a>
                    <a href="###">LED灯设计</a>
                    <a href="###">钢 管</a>
                    <a href="###">LED灯设计</a>
                    <a href="###">钢 管</a>
                    <a href="###">LED灯设计</a>
                    <a href="###">钢 管</a>
                    <a href="###">钢 管</a>
                    <a href="###">LED灯设计</a>
                </div>
                <div class="contact">
                    <div style="width: 132px; float: left;margin-right: 20px">
                        <div class="ewm"><img src="../img/ewm1.jpg" alt="二维码"></div>
                        <p>微信二维码</p>
                    </div>
                    <ul>
                        <li>手机号：<span>18618130721</span></li>
                        <li>微信号：<span>18618130724</span></li>
                        <li>LinkedIn：<span>wangzhan</span></li>
                    </ul>
                    <ul>
                        <li>座机号：<span>01063955589</span></li>
                        <li>联系邮箱：<span>1842378765@qq.com</span></li>
                        <li>WhatsApp：<span>1842378765</span></li>
                    </ul>
                    <ul>
                        <li>我的网站：<span>01063955589</span></li>
                        <li>FaceBook：<span>1842378765@qq.com</span></li>
                    </ul>
                </div>
                <div style="float: right;">
                    <div class="bdsharebuttonbox"><a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a><a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a><a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a><a href="#" class="bds_tqf" data-cmd="tqf" title="分享到腾讯朋友"></a><a href="#" class="bds_fbook" data-cmd="fbook" title="分享到Facebook"></a><a href="#" class="bds_linkedin" data-cmd="linkedin" title="分享到linkedin"></a><a href="#" class="bds_twi" data-cmd="twi" title="分享到Twitter"></a></div>
                    <script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"1","bdSize":"24"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
                </div>
                <div class="btn-group">
                    <div style="margin-right: -30px;">
                        <a href="###" id="tran-btn">翻译</a>
                        <a href="###">修改</a>
                        <a href="###">开启</a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 尾部版权 -->
    <div class="foot">
        <div class="foot1">
            Copyright © 2018 世界汇网  www.thewiorldwie.cn
        </div>
    </div>

    <!-- 翻译弹出层 -->
    <div class="tran-box" style="display: none;">
        <div class="tran-tit">
            <h2>本次翻译次数为<span>365</span>字</h2>
        </div>
        <div class="tran-main">
            <div class="row">
                <p>选择支付币种</p>
                <div class="active">￥ 人民币</div>
                <div>$ 美金</div>
            </div>
            <div class="layui-clear"></div>
            <div class="row">
                <p>选择支付方式</p>
                <div><img src="../img/wx.png"/>微信支付</div>
                <div class="active"><img src="../img/zfb.png"/>支付宝支付</div>
                <div><img src="../img/paypal.jpg" width="150"/></div>
            </div>
            <hr/>
            <div class="conf">
                <div><button type="button" class="layui-btn">立即充值</button></div>
                <div>实付人民币<span>￥50.00</span></div>
            </div>
        </div>
        <div class="tran-close-btn"><i class="layui-icon" style="font-size: 30px">&#x1006;</i></div>
    </div>


    <script>
        layui.use(['form', 'layedit', 'laydate'], function(){
            var form = layui.form
                ,layer = layui.layer
                ,layedit = layui.layedit
                ,laydate = layui.laydate
                ,$ = layui.jquery;

             $(".language-btns").click(function(){
                if(!$(".span-div").is(':hidden')){//如果当前不隐藏
                    $('.span-div').hide();//就隐藏div
                    $(".language-icon").html("&#xe61a;")
                }else{//否则
					$('.userbox').hide();//就隐藏div
					$(".user-icon").html("&#xe61a;")
                    $('.span-div').show();//那么就显示div
                    $(".language-icon").html("&#xe619;")
                }
            })

            $(".user-btn").click(function(){
                if(!$(".userbox").is(':hidden')){//如果当前不隐藏
                    $('.userbox').hide();//就隐藏div
                    $(".user-icon").html("&#xe61a;")
                }else{//否则
 					$('.span-div').hide();//就隐藏div
 					$(".language-icon").html("&#xe61a;")
                    $('.userbox').show();//那么就显示div
                    $(".user-icon").html("&#xe619;")
                }
            });
            // 翻译按钮
            $("#tran-btn").click(function() {
                layer.open({
                    type: 1,
                    content: $('.tran-box'),
                    area: ['734px', '540px'],
                    title: false,
                    closeBtn: 0,
                });

                $(".tran-close-btn").click(function() {
                    layer.closeAll();
                })
            })

            $(".tran-box div").on("click", function (e) {
                var target = $(this),
                    parentBox = target.parent(),
                    allA = $(parentBox).find("div");

                allA.removeClass("active");
                target.addClass("active");

                return false;
            })


        })
    </script>
</body>
</html>